<template>
  <div class="box">
    <van-nav-bar
      title="工作日志"
      left-text="返回"
      left-arrow
      fixed
      @click-left="$router.push('/crm/project')"
    >
    </van-nav-bar>
    <div class="block">
      <van-list
        v-model="loading"
        :finished="finished"
        finished-text="没有更多了"
        @load="getList"
      >
        <el-timeline>
          <el-timeline-item
            :timestamp="item.createTime"
            placement="top"
            v-for="item in workList"
            :key="item.workId"
          >
            <el-card>
              <h4>
                <label>{{ item.createBy }}</label> 提交的工作日志
              </h4>
              <p v-html="item.workLog" class="worklog"></p>
              <p style="float: right">
                <span style="margin-right: 20px"
                  ><label>客户名称：</label> {{ item.customerName }}</span
                >
                <span
                  ><label>需求科室：</label>
                  <dict-tag
                    v-if="item.needDept !== '8'"
                    :options="dict.type.crm_project_dept"
                    :value="item.needDept"
                    style="display: inline-block"
                  />
                  <span v-else>{{ item.otherDept }}</span>
                </span>
              </p>
            </el-card>
          </el-timeline-item>
        </el-timeline>
      </van-list>
    </div>
  </div>
</template>

<script>
import { listWork } from "@/api/crm/work";
export default {
  name: "addWorklog",
  dicts: ["crm_project_dept"],
  data() {
    return {
      finished: false,
      form: {},
      customerList: [],
      workList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 1,
        needDept: null,
        otherDept: null,
        customerId: null,
        workLog: null,
      },
      loading: false,
      total: 0,
    };
  },
  created() {
    this.getList();   
  },
  methods: {
    resetQuery() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        needDept: null,
        otherDept: null,
        customerId: null,
        workLog: null,
      };
      this.getList();
    },
    async getList() {
      this.queryParams.projectId = this.$route.query.projectId
      this.loading = true;
      try {
        let res = await listWork(this.queryParams);
        // 判断是否加载完所有数据
        if (this.workList.length >= res.total) {
          this.finished = true;
        } else {
          this.workList.push(...res.rows);
          this.queryParams.pageNum += 1;
        }
      } catch (error) {
        console.error("加载数据失败", error);
      } finally {
        this.loading = false;
      }
    },
  },
};
</script>


<style scoped>
.block {
  margin: 65px 20px 10px 10px;
}
.demo-table-expand {
  font-size: 0;
}
.demo-table-expand label {
  width: 90px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
  width: 100%;
}

:v-deep .el-dialog__body {
  padding: 5px 20px 30px 20px;
}

.worklog {
  margin-left: 10px;
}
</style>